// 权限拦截在路由跳转 导航守卫拦截路由跳转
// 导航守卫用router来监听
import router from '@/router'
import store from '@/store' // 引入store实例 和组件中的 this.$store 是一回事
// 不需要导出，让代码执行即可
import nprogress from 'nprogress'
// 导入进度条
import 'nprogress/nprogress.css'
// 导入进度条样式

// 前置守卫
// next是前置守卫必须执行的钩子
// next() 跳过
// next(false) 跳转终止
// next(地址) 跳转到某个文件
const whiteList = ['/login', '/404']
router.beforeEach(async(to, from, next) => {
  nprogress.start() // 开启进度条
  // 如果有token
  if (store.getters.token) {
    // 如果在登录页
    if (to.path === '/login') {
      next('/') // 跳转到主页
    } else {
      if (!store.getters.userId) {
        // 如果没有ID，就去调用getUserInfo
        // 用async、await 把这行代码转换为同步，如果不转换，会造成next()已经执行完了，用户资料还没获取到
        await store.dispatch('user/getUserInfo')
      }
      next()
    }
  } else {
    if (whiteList.indexOf(to.path) > -1) {
      // 要去的地址是白名单，直接放行
      next()
    } else {
      // 否则跳转到登录界面
      next('/login')
    }
  }
  nprogress.done() // 如果跳转到登录页，但是因为有token存在，无法跳到登录页，进度条又没关闭，会一直显示，所以在最后面把进度条给关闭
})
// 后置守卫
router.afterEach(() => {
  nprogress.done() // 关闭进度条
})
